@mixin prefixer ($property, $value,
                 $moz:    true,
                 $webkit: true,
                 $o:      true,
                 $ms:     true,
                 $spec:   true) {
  @if $moz    {    -moz-#{$property}: $value; }
  @if $webkit { -webkit-#{$property}: $value; }
  @if $o      {      -o-#{$property}: $value; }
  @if $ms     {     -ms-#{$property}: $value; }
  @if $spec   {         #{$property}: $value; }
}

@mixin inline-block {
  display: inline-block;
  vertical-align: baseline;
  *display: inline;
  *vertical-align: auto;
  zoom: 1;
}


@mixin box-shadow{
    @include prefixer("box-shadow", 5px, not ms);
    filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=135, Strength=3);
    zoom:1;
}

@mixin alpha($opacity){
    @include prefixer("opacity",$opacity, not o, not webkit, not moz, not ms);
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=#{$opacity*100});
    zoom: 1;
}

@mixin gradient($startColor , $endColor){
    
    background-color:$startColor;
    background-image: -webkit-linear-gradient(top, $startColor, $endColor);
    background-image: -moz-linear-gradient(top, $startColor, $endColor);
    background-image: -ms-linear-gradient(top, $startColor, $endColor);
    background-image: -o-linear-gradient(top, $startColor, $endColor);
    background-image: linear-gradient(top, $startColor, $endColor);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#{$startColor}, endColorstr=#{$endColor});
    zoom:1;
}

@mixin fade($duration){
    @include prefixer("transition", opacity #{$duration} ease-in-out);
    filter:progid:DXImageTransform.Microsoft.Fade(duration=#{$duration*100});
    zoom:1;
}

@mixin box-model($root-selector: unquote("#root"), $children-selector: unquote("#children")){
    #{$root-selector} {
        width:150px;

        &#{$children-selector} {
            padding:20px;
        }
    }
}

// Based on a [blog post by Ryan Fait](http://ryanfait.com/resources/footer-stick-to-bottom-of-page/).
//
// Must be mixed into the top level of your stylesheet.
//
// Footer element must be outside of root wrapper element.
//
// Footer must be a fixed height.

//Compass Stick Footer

@mixin sticky-footer($footer-height, $root-selector: unquote("#root"), $root-footer-selector: unquote("#root_footer"), $footer-selector: unquote("#footer")) {
      html, body {
        height: 100%;
      }

      #{$root-selector} {
        clear: both;
        min-height: 100%;
        height: auto !important;
        height: 100%;
        margin-bottom: -$footer-height;

        #{$root-footer-selector} {
          height: $footer-height;
        }
      }

      #{$footer-selector} {
        clear: both;
        position: relative;
        height: $footer-height;
      }
}


@mixin spaced-itens ($wrapper: unquote("#wrap"), $root: unquote("#root"), $child: unquote("#children")){
    #{$wrapper} {
        overflow:hidden;
        width:100%;

        #{$root}{
            width:105%;
            overflow:hidden;

            #{$child}{
             @include inline-block;
            }
        }
    }
}



